@mixin auto-scrollbar {
  box-sizing: border-box;
  padding-left: 10px;
  padding-right: 0;
  overflow-y: scroll;

  /* 定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸 */
  &::-webkit-scrollbar {
    width: 10px;
    height: 10px;
  }

  /* 定义滚动条轨道（track） */
  &::-webkit-scrollbar-track {
    background: transparent;
  }

  /* 定义滚动条滑块（thumb） */
  &::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: #c5c5c5;
    border: 2px solid #fff;
  }

  &:hover {
    &::-webkit-scrollbar-thumb {
      background: #c5c5c5;
    }
  }
}

@mixin utils-user-select($value) {
  -webkit-touch-callout: $value;
  -webkit-user-select: $value;
  -khtml-user-select: $value;
  -moz-user-select: $value;
  -ms-user-select: $value;
  user-select: $value;
}

@function hexToRGB($hex) {
  @return red($hex), green($hex), blue($hex);
}

@mixin generate_colors($colors) {
  // Colors
  @each $color, $value in $colors {
    @if str-slice(#{$value}, 1, 1) == '#' {
      --#{$color}: #{$value};
    } @else {
      --#{$color}: var(--#{$value});
    }
  }

  // RGB Colors
  @each $color, $value in $colors {
    @if str-slice(#{$value}, 1, 1) == '#' {
      --RGB_#{$color}: #{hextorgb($value)};
    } @else {
      --RGB_#{$color}: var(--RGB_#{$value});
    }
  }
}
